<!DOCTYPE html>
<html>

	<head>
		<meta charset="utf-8">
		<title>会员升级</title>
		<meta name="viewport" content="width=device-width, initial-scale=1,maximum-scale=1,user-scalable=no">
		<meta name="apple-mobile-web-app-capable" content="yes">
		<meta name="apple-mobile-web-app-status-bar-style" content="black">

		<!--标准mui.css-->
		<link rel="stylesheet" href="../css/mui.min.css">
		<link rel="stylesheet" type="text/css" href="../css/icons-extra.css" />
        <link rel="stylesheet" type="text/css" href="../css/index.css" />
        <!--App自定义的css-->
		<link rel="stylesheet" type="text/css" href="../css/app.css"/>
		<script src="../js/mui.min.js"></script>		
	</head>

	<body>
		<header class="mui-bar mui-table-view all-top">
			<a class="mui-action-back mui-icon mui-icon-left-nav mui-pull-left"></a>
			<h1 class="mui-title">会员升级</h1>
			<a class="mui-icon  mui-icon-more-filled mui-pull-right"></a>
		</header>	    
		<ul class="mui-table-view mui-table-view-striped mui-table-view-condensed"  style="background-color: #e45050; margin-top:2.7rem;">
			<li class="mui-table-view-cell">
					<div class="mui-slider-cell">
						<div class="oa-contact-cell mui-table" style="margin-left:3%;">
							<div class="oa-contact-avatar mui-table-cell">
								<img src="../images/tou-logo.jpg" width="42" height="42" />
							</div>
							<div class="oa-contact-content mui-table-cell">
								<div>
									<p class="oa-contact-name">张三</p>	
								</div>
							</div>
						</div>
					</div>
			</li>
	    </ul>
	    <div style="margin-top: 1rem; background-color: #fff1d3; font-size: 14px; padding: .8rem .9rem;">押金充值</div>
	    <div class="mui-content">
			<div>
				<ul class="mui-table-view">	
					<li class="mui-table-view-cell mui-collapse">
						<a class="mui-navigate-right" href="#">
							<p class="hui-tong">开通铜牌会员</p>
							<p  class="hui-j">铜牌会员，适用于试听及用户</p>
						</a>						
							<ul class="mui-collapse-content">
				                <li class="mui-table-view-cell ">
					                <a href="ya-chong.html">
					                    <span style="font-size: 14px;">1个月<span style="color: #EC971F;">25</span>元</span>
					                    <button type="button" class="mui-btn mui-btn-warning hui-sx" >开通</button>
					                </a>
				                </li>
				                <li class="mui-table-view-cell ">
					                <a href="ya-chong.html">
					                    <span style="font-size: 14px;">3个月<span style="color: #EC971F;">68</span>元</span>
					                    <button type="button" class="mui-btn mui-btn-warning hui-sx" >开通</button>
					                </a>
				                </li>
				                <li class="mui-table-view-cell ">
					                <a href="ya-chong.html">
					                    <span style="font-size: 14px;">6个月<span style="color: #EC971F;">128</span>元</span>
					                    <button type="button" class="mui-btn mui-btn-warning hui-sx" >开通</button>
					                </a>
				                </li>
				                <li class="mui-table-view-cell ">
					                <a href="ya-chong.html">
					                    <span style="font-size: 14px;">年费<span style="color: #EC971F;">233</span>元</span>
					                    <button type="button" class="mui-btn mui-btn-warning hui-sx" >开通</button>
					                </a>
				                </li>
				          </ul>						
					</li>
					<li class="mui-table-view-cell mui-collapse">
						<a class="mui-navigate-right" href="#">
							<p class="hui-yin">开通银牌会员</p>
							<p  class="hui-j">银牌会员，适用于试听及用户</p>
						</a>						
							<ul class="mui-collapse-content">
				                <li class="mui-table-view-cell ">
					                <a href="ya-chong.html">
					                    <span style="font-size: 14px;">1个月<span style="color: #EC971F;">25</span>元</span>
					                    <button type="button" class="mui-btn mui-btn-warning"  style="height: 30px; font-size: 12px;">开通</button>
					                </a>
				                </li>
				                <li class="mui-table-view-cell ">
					                <a href="ya-chong.html">
					                    <span style="font-size: 14px;">3个月<span style="color: #EC971F;">68</span>元</span>
					                    <button type="button" class="mui-btn mui-btn-warning"  style="height: 30px; font-size: 12px;" >开通</button>
					                </a>
				                </li>
				                <li class="mui-table-view-cell ">
					                <a href="ya-chong.html">
					                    <span style="font-size: 14px;">6个月<span style="color: #EC971F;">128</span>元</span>
					                    <button type="button" class="mui-btn mui-btn-warning"  style="height: 30px; font-size: 12px;" >开通</button>
					                </a>
				                </li>
				                <li class="mui-table-view-cell ">
					                <a href="ya-chong.html">
					                    <span style="font-size: 14px;">年费<span style="color: #EC971F;">233</span>元</span>
					                    <button type="button" class="mui-btn mui-btn-warning"  style="height: 30px; font-size: 12px;">开通</button>
					                </a>
				                </li>
				          </ul>						
					</li>
					<li class="mui-table-view-cell mui-collapse">
						<a class="mui-navigate-right" href="#">
							<p class="hui-jin">开通金牌会员</p>
							<p  class="hui-j">金牌会员，适用于试听及用户</p>
						</a>						
							<ul class="mui-collapse-content">
				                <li class="mui-table-view-cell ">
					                <a href="ya-chong.html">
					                    <span style="font-size: 14px;">1个月<span style="color: #EC971F;">25</span>元</span>
					                    <button type="button" class="mui-btn mui-btn-warning"  style="height: 30px; font-size: 12px;" >开通</button>
					                </a>
				                </li>
				                <li class="mui-table-view-cell ">
					                <a href="ya-chong.html">
					                    <span style="font-size: 14px;">3个月<span style="color: #EC971F;">68</span>元</span>
					                    <button type="button" class="mui-btn mui-btn-warning"  style="height: 30px; font-size: 12px;" >开通</button>
					                </a>
				                </li>
				                <li class="mui-table-view-cell ">
					                <a href="ya-chong.html">
					                    <span style="font-size: 14px;">6个月<span style="color: #EC971F;">128</span>元</span>
					                    <button type="button" class="mui-btn mui-btn-warning"  style="height: 30px; font-size: 12px;" >开通</button>
					                </a>
				                </li>
				                <li class="mui-table-view-cell ">
					                <a href="ya-chong.html">
					                    <span style="font-size: 14px;">年费<span style="color: #EC971F;">233</span>元</span>
					                    <button type="button" class="mui-btn mui-btn-warning"  style="height: 30px; font-size: 12px;">开通</button>
					                </a>
				                </li>
				          </ul>						
					</li>
					<li class="mui-table-view-cell mui-collapse" style="color: #444444;">
						<a class="mui-navigate-right" href="#">
							<p class="hui-super">开通超级会员</p>
							<p  class="hui-j">超级会员，适用于试听及用户</p>
						</a>						
							<ul class="mui-collapse-content">
				                <li class="mui-table-view-cell ">
					                <a href="ya-chong.html">
					                    <span style="font-size: 14px;">1个月<span style="color: #EC971F;">25</span>元</span>
					                    <button type="button" class="mui-btn mui-btn-warning"  style="height: 30px; font-size: 12px;">开通</button>
					                </a>
				                </li>
				                <li class="mui-table-view-cell ">
					                <a href="ya-chong.html">
					                    <span style="font-size: 14px;">3个月<span style="color: #EC971F;">68</span>元</span>
					                    <button type="button" class="mui-btn mui-btn-warning"  style="height: 30px; font-size: 12px;" >开通</button>
					                </a>
				                </li>
				                <li class="mui-table-view-cell ">
					                <a href="ya-chong.html">
					                    <span style="font-size: 14px;">6个月<span style="color: #EC971F;">128</span>元</span>
					                    <button type="button" class="mui-btn mui-btn-warning"  style="height: 30px; font-size: 12px;" >开通</button>
					                </a>
				                </li>
				                <li class="mui-table-view-cell ">
					                <a href="ya-chong.html">
					                    <span style="font-size: 14px;">年费<span style="color: #EC971F;">233</span>元</span>
					                    <button type="button" class="mui-btn mui-btn-warning"  style="height: 30px; font-size: 12px;" >开通</button>
					                </a>
				                </li>
				          </ul>						
					</li>
				</ul>
			</div>
		</div>

	</body>

</html>